<div data-controller="sections-split">
  <div class="row h-100 gx-0">
    <!-- left -->
    <div class="col-6 d-none d-lg-block">
      <div class="d-flex flex-column sections-split-left" style="height: 100%;">
        <div class="d-flex flex-column position-sticky justify-content-center left-center<% if with_navbar {%>-navbar<% } %>">
          <%+ greeting_area.clone() %>
        </div>
      </div>
    </div>

    <!-- right -->
    <div class="col-12 col-lg-6 ">
      <div class="d-flex flex-column align-items-center justify-content-center sections-split-right pt-lg-5 pt-0 pb-5 px-3 right-center<% if with_navbar {%>-navbar<% } %>">
        <div class="glow-1"></div>
        <div class="glow-2"></div>
        <div class="glow-3"></div>
        <div class="glow-4"></div>
        <div class="glow-5"></div>
        <div class="d-flex d-lg-none"><%+ greeting_area %></div>
        
        <%+ display_area %>
      </div>
    </div>
  </div>
</div>
